<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>加入Wxmall Vip</title>
[#include "/includes/header.html" /]
<style>
.placeholder {
   	margin: 5px;
   	padding: 0 10px;
   	background-color: #ebebeb;
   	height: 2.3em;
   	line-height: 2.3em;
   	text-align: center;
   	color: #cfcfcf;
}
.active{
	color: #ffffff;
	background-color:#1aad19;
}
</style>
</head>
<body>
<header class='demos-header'>
  	<h3 class="demos-title">Wxmall Vip</h3>
</header>
<div class="weui-panel">
   	<div class="weui-panel__hd">支付金额</div>
   	<div class="weui-panel__bd">
		<div class="weui-flex">
		  	<div style="cursor: pointer;" class="weui-flex__item"><div c="5999" class="placeholder">￥5999.00</div></div>
		</div>
   	</div>
   	[#if vip??]
   	<div class="content-padded">
	    <a class="weui-btn weui-btn_primary">已成为会员</a>
	</div>
	[#else]
	<div class="content-padded">
	    <a id="recharge_btn" href="javascript:void(0);" class="weui-btn weui-btn_primary">立即加入</a>
	</div>
   	[/#if]
</div>        
[#include "includes/footer.html"/]
<script type="text/javascript">
$("div.weui-flex__item").each(function(i){
	if(i==0){
		$(this).find("div").addClass("active");
		return;
	}
});
$("div.weui-flex__item").click(function(){
	$("div.weui-flex__item").each(function(){
		$(this).find("div").removeClass("active");
	});
	$(this).find("div").addClass("active");
	return false;
});
$("#recharge_btn").click(function(){
	var recharge = $("div.active").attr("c");
	if(recharge == undefined || recharge == ""){
		showMsg("请选择充值金额");
		return;
	}
	var params = {};
	params.recharge = recharge;
	params.vip = '1';
	$.post("${webctx}/pay", params, function(data){
  		var resp = data;
		if(resp.code != 200){
			$.alert(resp.msg==null ? "系统错误" : resp.msg);
			return;
		}
		var json = resp.data;
		if(json.returnMsg=='OK'){
			WeixinJSBridge.invoke(
		       'getBrandWCPayRequest', {
		            "appId":json.appId,     		//公众号名称，由商户传入     
		            "nonceStr":json.nonceStr, 		//随机串     
		            "package":json.packageValue,
		            "paySign":json.paySign, 		//微信签名 
		            "signType":"MD5",         		//微信签名方式：     
		            "timeStamp":json.timeStamp      //时间戳，自1970年以来的秒数     
		     	},
		       	function(res){     
		            if(res.err_msg == "get_brand_wcpay_request:ok" ) {
		            	//使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
		            	//location.href="${webctx}/pay/success";
		            	showMsg("支付成功", function(){
		            		//location.href = "${webctx}/user";						            		
		            	});
		            }else if(res.err_msg == "get_brand_wcpay_request:cancel"){
		            	//$.alert("您取消了支付", "text");
		            }else {
		            	$.alert("支付失败，" + res.err_msg);
		            }     
		       	}
		    );
		}
	});
});
</script>
</body>
</html>